import React from "react";
import { Form, Input, Button, Card, message } from "antd";
import { UserOutlined, LockOutlined } from "@ant-design/icons";
import { useNavigate } from "react-router-dom";
import "./index.less";

const Login: React.FC = () => {
  const navigate = useNavigate();

  const onFinish = async (values: { username: string; password: string }) => {
    try {
      // 这里添加实际的登录逻辑
      console.log("登录信息:", values);

      // 模拟登录成功
      localStorage.setItem("token", "dummy-token");
      localStorage.setItem(
        "user",
        JSON.stringify({ username: values.username }),
      );

      message.success("登录成功！");
      navigate("/");
    } catch (error) {
      message.error("登录失败，请重试！");
    }
  };

  return (
    <div className="login-container" data-oid="ijcc_92">
      <Card className="login-card" data-oid="1f_jp23">
        <div className="login-header" data-oid="fa:dyvw">
          <h2 data-oid="_795b3u">Progress AI</h2>
          <p data-oid="2.le1.p">欢迎登录系统</p>
        </div>
        <Form
          name="login"
          onFinish={onFinish}
          autoComplete="off"
          size="large"
          data-oid=".1hg7j0"
        >
          <Form.Item
            name="username"
            rules={[{ required: true, message: "请输入用户名！" }]}
            data-oid="fhhwokr"
          >
            <Input
              prefix={<UserOutlined data-oid="1vbgdwa" />}
              placeholder="用户名"
              data-oid="0vyye7y"
            />
          </Form.Item>

          <Form.Item
            name="password"
            rules={[{ required: true, message: "请输入密码！" }]}
            data-oid="cs4c5.c"
          >
            <Input.Password
              prefix={<LockOutlined data-oid="u10c.h2" />}
              placeholder="密码"
              data-oid="16x2p3f"
            />
          </Form.Item>

          <Form.Item data-oid="2ku.m28">
            <Button type="primary" htmlType="submit" block data-oid="m3i78rm">
              登录
            </Button>
          </Form.Item>
        </Form>
      </Card>
    </div>
  );
};

export default Login;
